<template>
  <a-layout class="layout-demo">
    <a-layout-sider breakpoint="xl" :width="320">
      <assist-sider @change="changeCode"></assist-sider>
    </a-layout-sider>
    <a-layout>
      <a-layout style="padding: 0 10px">
        <a-layout-content>
          <assist-content ref="assistContentRef"></assist-content>
        </a-layout-content>
      </a-layout>
    </a-layout>
  </a-layout>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import AssistSider from "@/views/assistComput/components/assist-sider.vue";
import AssistContent from "@/views/assistComput/components/assist-content.vue";

const assistContentRef = ref();
const changeCode = (code: string) => {
  assistContentRef.value.getAssistComputDetail(code);
};
</script>

<style scoped>
.layout-demo {
  height: 82vh;
  background: var(--color-fill-2);
  border: 1px solid var(--color-border);
}
</style>
